<template>
  <div class="title1">
    <el-row>
      <el-col :span="24">
        <div class="title2"><div class="text">基础信息</div></div>
        <div class="title3">
          <div style="margin-top: 33px;">
            <span style="color: red;">*</span>
            <span class="text">头像：</span>
          </div>
          <img class="img" src="@/static/touxiang.png" alt="">
        </div>
        <div class="title3">
          <span style="color: red;">*</span>
          <span class="text">昵称：</span>
          <span class="text1">{{ data.userName }}</span>
        </div>
        <div class="title3" style="margin-left: 80px;">
          <span class="text">姓名：</span>
          <span class="text1">{{ data.userName }}</span>
        </div>
        <div class="title3" style="margin-left: 80px;">
          <span class="text">性别：</span>
          <span class="text1">{{ data.sex==0 ?'男':'女' }}</span>
        </div>
        <div class="title3" style="margin-left: 44px;">
          <span class="text">身份证号：</span>
          <span class="text1">{{ data.idCard }}</span>
        </div>
        <div class="title3" style="margin-left: 44px;">
          <span class="text">所属网点：</span>
          <span class="text1">{{ data.deptInfo }}</span>
        </div>
        <div class="title3" style="margin-left: 44px;">
          <span class="text">所属部门：</span>
          <span class="text1">{{ data.networkName }}</span>
        </div>
        <div class="title3" style="margin-left: 80px;">
          <span class="text">职位：</span>
          <span class="text1">{{ data.position }}</span>
        </div>
        <div class="title2" style="margin-top: 41px;"><div class="text">联系方式</div></div>
        <div class="title3" style="margin-left: 63px;">
          <span class="text">手机号：</span>
          <span class="text1">{{ data.phone }}</span>
        </div>
        <div class="title3" style="margin-left: 63px;">
          <span class="text">座机号：</span>
          <span class="text1">{{ data.landline }}</span>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { getUserInfoApi} from '@/api/user'
export default {

  components: {},
  data() {
    return {
      data:{}
    }
  },

  computed: {},

  created() {},
  mounted(){
 this.getUserInfoFn()
  },

  methods: {
    //获取个人信息
   async getUserInfoFn(){
     let res=await getUserInfoApi()
     if(res.code==200){
       this.data=res.data
     }
     console.log(res,'个人信息')
    }
  }
}

</script>
<style  scoped lang="scss">
.title1{
  margin-left: 48px;
}
.title2{
height: 57px;
background: #F5F5F5;
border-radius: 4px 4px 0px 0px;
line-height: 57px;
.text{
margin-left: 25px;
font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 600;
color: #333333;
}

}
.title3{
  margin: 30px 0 0 73px;
  display: flex;
  .text{
    font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
  }
  .img{
    width: 83.7px;
    height: 83.7px;
  }
  .text1{
    font-size: 18px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #333333;
  }
}
</style>
